<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div id="box">我是id盒子</div>
    <div name="username" class="item">我是类盒子</div>
    <div class="item">我是类盒子</div>
    <div class="item">我是类盒子</div>
    <p>我是段落</p>
    <p>我是段落</p>
    <p>我是段落</p>
    <input type="text" name="username" />
    <input type="password" name="password" />
  </body>
</html>
<script>
  // 其他的获取DOM元素的方法：
  // document.querySelector()
  // document.querySelectorAll()

  // 1.document.getElementById()  //根据id来获取元素
  // const box= document.getElementById('box')
  // console.log(box);

  // 2.document.getElementsByClassName('item')  //根据 类名获取元素   返回值是数组
  // const items = document.getElementsByClassName('item')
  // console.log(items);

  // 3.document.getElementsByTagName() //根据标签名来获取元素
  // const pp =document.getElementsByTagName('p')
  // console.log(pp);

  // 4.document.getElementsByName()  //根据那么属性名来获取   返回值是数组
  const name = document.getElementsByName("username");
  console.log(name);
</script>
